[#escape x as x?html]
<!DOCTYPE html>
<html>
<head>
    [#include "/include/meta.ftl" /]
    [#include "/include/css.ftl" /]
    <title>文章分类列表</title>
    [#include "/include/js.ftl" /]
</head>
<body class="hold-transition skin-blue sidebar-mini">
<div class="wrapper">

    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper margin-left0">
        [#assign firstNavName="文章分类"]
        [#assign secondNavName="列表"]
        [#include "/include/contentHeader.ftl" /]

        <!-- Main content -->
        <section class="content">
            <div class="row">
                <div class="col-xs-12">
                    <form id="formList" action="list">
                        <input type="hidden" name="pageNumber" value="${page.pageNumber}" />
                        <input type="hidden" name="pageSize" value="${page.pageSize}" />
                        <input type="hidden" name="searchProperty" value="${page.searchProperty!}" />
                        <div class="box">
                            <div class="box-header padding-bottom0">
                                <div id="searchBox" class="search-box">
                                    <div class="row">
                                        <div class="col-md-4">
                                            <div class="input-group">
                                                <div class="input-group-btn dropdown divDropdown">
                                                    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                                                        <span class="text spanSearchProperty" data-search-property="${page.searchProperty!}">名称</span> <span class="fa fa-caret-down"></span>
                                                    </button>
                                                    <ul class="dropdown-menu dropdownMenu">
                                                        <li><a data-search-property="name">名称</a></li>
                                                        <li><a data-search-property="description">描述</a></li>
                                                    </ul>
                                                </div>
                                                <!-- /btn-group -->
                                                <input type="text" name="searchValue" class="form-control" value="${page.searchValue!}">
                                                <div class="input-group-btn">
                                                    <button type="submit" class="btn btn-info btnSearch"><i class="fa fa-search"></i></button>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row divAction padding-t-b5">
                                    <div class="col-md-4">
                                        <button type="button" class="btn btn-info btn-sm btnRefresh">刷新</button>
                                        <a href="add" class="btn btn-success btn-sm btnAdd">新增</a>
                                        <button type="button" class="btn btn-danger btn-sm btnDelete">删除</button>
                                    </div>
                                </div>
                            </div>
                            <!-- /.box-header -->
                            <div class="box-body padding-top0">
                                <table id="example1" class="table table-bordered table-striped tableList">
                                    <thead>
                                    <tr>
                                        <th class="check width20" >
                                            <input type="checkbox" id="selectAll"/>
                                        </th>
                                        <th>名称</th>
                                        <th>操作</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                        [#list page.content as articleClass]
                                        <tr>
                                            <td>
                                                <input type="checkbox" name="ids" value="${articleClass.id}" />
                                            </td>
                                            <td>${articleClass.name}</td>
                                            <td>
                                                <a href="edit?id=${articleClass.id}" class="btn btn-info btn-xs">编辑</a>
                                            </td>
                                        </tr>
                                        [/#list]
                                    </tbody>
                                </table>
                                <div id="pagingNode">

                                </div>
                            </div>
                            <!-- /.box-body -->
                        </div>
                        <!-- /.box -->
                    </form>
                </div>
                <!-- /.col -->
            </div>
            <!-- /.row -->
        </section>
        <!-- /.content -->
    </div>
    <!-- /.content-wrapper -->


</div>
<!-- ./wrapper -->
<script type="text/javascript">
    require(['public/js/list', 'admin/js/articleClass/list', 'public/js/paging', 'jquery'], function(List, Page, Paging, $){
        Page.main();
        // 分页
        var config = {
            page_info: {
                current_page: ${page.pageNumber}, // 当前页
                page_rows: ${page.pageSize}, // 每页记录数
                total_pages: ${page.totalPages}, // 总页数
                total_rows: ${page.total} //  总记录数
            },
            class_config: {
                page_word_skip_btn_c:'btn btn-primary btn-sm',
                page_number_wrap_c:'pagination',
                page_current_c:'active',
            },
            page_node: {
                $dom: $('#pagingNode')
            },
            success: function(data){
                var $formList = $('#formList');
                $formList.find('input[name=pageNumber]').val(data.number);
                $formList.find('input[name=pageSize]').val(data.page_rows);
                $formList.find('.btnSearch').click();
            }
        }
        Paging.paging(config);
    });
</script>
</body>
</html>
[/#escape]
